<template>
  <el-form ref="detailForm" :inline="false" class="elForm" :class="isEdit?'':'formItem'">
    <el-card class="box-card">
      <div slot="header" class="header-card" style="display: flex;justify-content: space-between;align-items: center">
        <span class="header-card-title">基础信息</span>
        <div>
          <el-button type="primary" @click="handleBatchExportTable">批量下载表格</el-button>
          <el-button type="primary" @click="handleBatchExportUpToStandard">批量下载合格证</el-button>
          <!--          <el-button type="primary">批量下载发票</el-button>-->
        </div>
      </div>
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="车辆总台数:">
            <span> {{ detailForm.carCount }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="[1,null,''].includes(detailForm.carCount)">
          <el-form-item label="车架号:">
            <span>{{ detailForm.vinNo }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="车辆产权:" prop="propertyRightName">
            <span>{{ detailForm.propertyRightName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="车型:">
            <span>{{ detailForm.modelName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="合计费用:">
            <span>{{ format_thousand(detailForm.totalPrice) }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>
  </el-form>
</template>

<script>
import JSZip from 'jszip';
import FileSaver from 'file-saver';
import {listByIds} from '@/api/system/oss';

export default {
  name: "hojiInfo", //基础信息（保司报价）
  props: {
    value: {
      type: Object,
      default: () => {
        return {};
      },
    },
    state: {
      type: String,
      default: "",
    },
  },

  computed: {
    detailForm: {
      get() {
        let that = this
        const proxy = new Proxy(that.value, {
          get(target, key, value) {
            return Reflect.get(target, key)
          }
        })
        return proxy
      }
    },
    isEdit() {
      let bool;
      switch (this.state) {
        case "write":
          bool = true;
          break;
        case "disabled":
          bool = false;
          break;
        case "readonly":
          bool = false;
          break;
      }
      return bool
    }
  },

  watch: {
    'value.insuranceVoList': {
      handler(val) {
        if (val) {
          this.handleTotalPrice()
        }
      },
      immediate: true,
      deep: true
    },
  },

  data() {
    return {
      ids: []
    }
  },

  created() {
    this.handleTotalPrice()
  },
  mounted() {
  },
  methods: {
    handleTotalPrice() {
      let num = 0
      for (let i = 0; i < this.value.insuranceVoList.length; i++) {
        num +=
            Math.round(Number(this.value.insuranceVoList[i].carTax) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].jqxAmount) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].szxPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].ckPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].jsyPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].csxPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].clPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].hhxPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].qtPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].zzfwPrice) * 100) +
            Math.round(Number(this.value.insuranceVoList[i].otherInsuranceSumAmount))
      }
      this.$set(this.detailForm, 'totalPrice', (num / 100).toFixed(2))
    },
    handleBatchExportTable() {
      if (this.value?.workIdList.length > 0) {
        this.ids = this.value.workIdList
        this.download_json(
            "car/insurance/exportFromCarList",
            [...this.ids],
            `批量下载表格_${new Date().getTime()}.xlsx`
        )
      }
    },

    async mergeImagesToZip(imageUrls) {
      const zip = new JSZip();
      const folder = zip.folder('images');

      for (let i = 0; i < imageUrls.length; i++) {
        let blob = imageUrls[i].blob, name = imageUrls[i].name
        try {
          folder.file(name, blob);
        } catch (error) {
          console.error(`Error fetching ${error}`);
        }
      }

      try {
        const content = await zip.generateAsync({type: 'blob'});
        FileSaver.saveAs(content, `${new Date().getTime()}_images.zip`);
      } catch (error) {
        console.error('Error generating ZIP file:', error);
      } finally {
        this.$modal.closeLoading();
      }
    },

    async handleBatchExportUpToStandard() {
      this.$modal.loading("正在下载，请稍候...");
      let urlList = []
      try {
        if (this.value.qualifiedCardOssList && this.value.qualifiedCardOssList.length > 0) {
          for (let i = 0; i < this.value.qualifiedCardOssList.length; i++) {
            let ossId = this.value.qualifiedCardOssList[i]
            let res = await listByIds(ossId)
            let obj = await this.$download.ossB(ossId)  //await this.handleUrl(ossId)   //
            urlList.push({
              name: ossId + res.data[0].originalName,
              blob: obj,
            })
          }

          if (urlList.length > 0) {
            await this.mergeImagesToZip(urlList,)
          }

        }
      } catch (e) {

      }
    },

    handleBatchExportUpToStandard1() {
      if (this.value.qualifiedCardOssList && this.value.qualifiedCardOssList.length > 0) {
        this.value.qualifiedCardOssList.map(a => {
          this.$download.oss(a)
        })
      }
    },
  },
};
</script>

<style scoped lang="scss">
@import "@/styles/cwgd/formScss.scss";
</style>
